<template>
    <d2-container>
        <el-main>
            <el-form  :model="expense" ref="expense" :rules="formRules">

                <el-form-item label="进出款" prop="type" style="width:150px">
                    <el-select v-model="expense.type" :disabled='disabled'>
                       <el-option v-for="type in option.types" :label="type.name" :key="type.type" :value="type.type">
                        </el-option>
                    </el-select>
                </el-form-item>

                    <el-form-item label="类型" prop="category" style="width:150px">
                        <el-select v-model="expense.category" :disabled='disabled'>
                       <el-option v-for="category in option.category" :label="category" :key="category" :value="category">
                        </el-option>
                    </el-select>
                    </el-form-item>

                <el-form-item label="金额" prop="total">
                    <el-input placeholder  type='number' v-model.number="expense.total" :disabled='disabled'></el-input>
                </el-form-item>
                <el-form-item label="时间" prop="date" style="width:150px" >
                  <el-date-picker
                          v-model="expense.date"
                          type="date"
                          placeholder="选择款项时间"
                          :disabled="disabled"
                  ></el-date-picker>
                </el-form-item>
                <el-form-item label="备注" prop="remark">
                    <el-input placeholder v-model="expense.comment" :disabled='disabled' type='textarea' style="max-width: 500px" :rows=7></el-input>
                </el-form-item>

                

            </el-form>
        </el-main>
        <el-footer>
            <el-button type="primary" @click="submit" :disabled='disabled'>提交</el-button>
            <el-button type="secondary" @click="disabled = false">修改</el-button>
        </el-footer>
    </d2-container>
</template>
<script>
    import request from "@/plugin/axios";
    import {mapState} from "vuex";
    export default {
        data() {
            return {

                option: {
                   category:['工资','差旅费','奖金','加盟费','调货费'],
                   types : [{'name':'进',type:1},{'name':'出',type:0}],
                   schoolList: undefined
                },
                expense :{
                    total : undefined,
                    staff : undefined,
                    school : undefined,
                    comment : undefined,
                    type : undefined,
                    category : undefined,
                    date : undefined
                },

                disabled: false,
                formRules: {
                   
                    total: [
                        {required: true, message: '价格不能为空', trigger: 'change'},
                        {type: 'number', message: '请输入正数', trigger: 'change'}

                    ],
                    date : [ {required: true, message: '时间不能为空', trigger: 'change'}],
                     type: [
                        {required: true, message: '请选择出或入', trigger: 'change'},

                    ],
                    category: [
                        {required: true, message: '请选择出入款类别', trigger: 'change'},

                    ]
                    
                },

            };
        },
        computed: {
            ...mapState('d2admin/user', ['info']),
        },
        methods: {
            submit() {
                let url = "/data/addinout";
                if (this.id != undefined){
                    url = '/data/updateinout'
                }
                this.expense.school = this.school
                this.expense.staff = this.info.staff._id
                console.log(url,'asds')
                request({
                    url: url,
                    method: "post",
                    data: this.expense
                }).then(res => {
                    if (res.code == 200) {
                        this.$alert("", "提交出入款成功", {
                            confirmButtonText: "确定"
                        }).then(()=>{
                            this.refresh = true
                            this.$router.back(-1)
                            
                        });
                        

                        
                        this.expense = {}
                    }
                    // 返回数据
                });
            },
           
           

            getExpenseCategory(){
                request({
                    url:'/school/getExpenseCategory',
                    method:'post',
                    data :{school:this.school}
                }).then(res=>{
                    if (res.code == 200){
                        this.option.category = this.option.category.concat(res.data.map(e=>{return e.name}))
                    }
                })
            },
            getOneExpense(id) {
                request({
                    url: "/data/getinoutDetail",
                    method: "post",
                    data: {id: id}
                }).then(res => {
                    console.log(res,'dsls')
                    this.expense = res.data

                });
            },
        },
          beforeRouteLeave(to,from,next){
        if (this.refresh){
          to.meta.refresh = 'a'
          this.refresh = undefined
        }
        next()
      },

        created() {
            this.school = this.info.school[0]._id
            if (this.$route.query.id != undefined) {
                this.id = this.$route.query.id
                this.getOneExpense(this.id)
                this.disabled = true
            }
            this.getExpenseCategory()
        }
    };
</script>
